﻿<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>选择服务项目</title>
<head th:include="include :: header"></head>
<link type="text/css" rel="stylesheet" th:href="@{/css/style2.css}" />
</head>

<body>
	<div class="main_box">
		<div class="cont_box editpro_box">
			<form action="#" method="post" id="choose_form">
				<ul class="addpro_box">
					<li><label>理发师选择：</label> <select name="barbers" required
						data-msg-required="请选择理发师">
							<option value="">请选择</option>
							<!--这里value为服务的id-->
							<option value="01">理发师1</option>
							<option value="02">理发师2</option>
							<option value="03">理发师3</option>
							<option value="04">理发师4</option>
					</select></li>

					<li><label>选择服务:</label></li>
					<li><label>剪：</label>
						<div class="f_left choose_span choose_radio" id="haircut">
							<!--这里span需要传剪的id-->
							<span id="11">单剪</span> <span id="12">洗剪吹</span> <span id="13">造型</span>
						</div></li>
					<li><label>热烫：</label>
						<div class="f_left choose_span choose_check" id="blanching">
							<!--这里span需要传热烫的id-->
							<span id="21">魅刻</span> <span id="22">美乐迪</span> <span id="23">施华蔻</span>
						</div></li>
					<li><label>冷烫：</label>
						<div class="f_left choose_span choose_radio" id="coldwave">
							<!--这里span需要传冷烫的id-->
							<span id="31">极速</span> <span id="32">低温</span> <span id="33">绿野</span>
						</div></li>
					<label>直发：</label>
					<div class="f_left choose_span choose_radio" id="straighten">
						<!--这里span需要传直发的id-->
						<span id="41">强力SPA</span> <span id="42">香薰</span> <span id="43">欧莱雅</span>
					</div>
					</li>

				</ul>
				<div class="probtn_box clearfix">
					<input type="button" value="确认选择" class="btn blue_btn" />
				</div>
			</form>
		</div>
	</div>
	<!--javascript include-->
	<div th:include="include :: footer"></div>
	<script th:src="@{/js/jquery.dataTables.min.js}"></script>
	<script th:src="@{/js/jquery.validate.min.js}"></script>
	<script th:src="@{/js/other.js}"></script>
	<script>
			$(function(){
				var Wparent = window.parent.document,
					tipBg = "<div class='tip_bg tipbg_top'></div>",
					tipBox = "<div class='tip_box tipbox_top'></div>";
				//=====弹出窗设置
				function DelTipWidth(Twidth,Theight){
					$(".tipbox_top",Wparent).css({"width":Twidth+"px","height":Theight+"px","margin-top":-(Theight/2)+"px","margin-left":-(Twidth/2)+"px"});
					$(".tip_close",Wparent).on("click",Tipclose);
				}
				//=====关闭弹出窗
				function Tipclose(){
					$(".tipbox_top",Wparent).remove(); //移除新增的外层className
					$(".tipbg_top",Wparent).remove(); //移除新增的背景className
				}
				//=====成功提示
				function Success(obj){
					$(".tipbox_top:last",Wparent).css({"width":"400px","height":"180px","margin-top":"-90px","margin-left":"-200px","z-index":"198611060"});
					$(".tip_close",Wparent).on("click",function(){
						if(obj==200){
							Tipclose();
							//关闭选服务页面
							$(".tip_bg",Wparent).remove();
							$(".tip_box",Wparent).remove();
						}else if(state!=200){
							Tipclose();
						}
					});
				}
				$(".choose_radio span").click(function(){
					if($(this).hasClass("curr")){
						$(this).removeClass("curr");
					}else{
						$(this).addClass("curr").siblings().removeClass("curr");
					}
					$(this).parent().next().val($(this).parent().find(".curr").text());
				});
				$(".choose_check span").click(function(){
					if($(this).hasClass("curr")){
						$(this).removeClass("curr");
					}else{
						$(this).addClass("curr");
					}
					$(this).parent().next().val($(this).parent().find(".curr").text());
				});
				$("#choose_form").validate({
					ignore:[],
					errorElement:"div"
				});
				//提交
				$(".btn").click(function(){
					var Wparent = window.parent.document,
						flag = $("#choose_form").valid();
					if (!flag) {  
						//alert("没有通过验证");  
						return;  
					}else{
						var data,arr = [],
							userInfo = $("iframe[name='cont_box']",Wparent).contents().find(".user_have table tr:first td input[name='m_id']").val(),
							barbers = $("select[name='barbers']").find("option:selected").text(),
							barbersId = $("select[name='barbers']").find("option:selected").val(),
							haircut = $("#haircut").find(".curr").text(),
							haircutId = $("#haircut").find(".curr").prop("id"),
							blanching = $("#blanching").find(".curr").text(),
							blanchingId = $("#blanching").find(".curr").prop("id"),
                                                        coldwave = $("#coldwave").find(".curr").text(),
							coldwaveId = $("#coldwave").find(".curr").prop("id"),
                                                        straighten = $("#straighten").find(".curr").text(),
							straightenId = $("#straighten").find(".curr").prop("id");
						
                                                //不是会员
						if(userInfo=="undefind"){
							data = {
								"haircutId":haircutId, //剪id
								"blanchingId":blanchingId, //热烫id
                                                                "coldwaveId":coldwaveId, //剪id
								"straightenId":straightenId, //热烫id
								"barbersId":barbersId, //理发师id
							};
						}else{
							data = {
								"userId":userInfo, //会员id
								"haircutId":haircutId, //剪id
								"blanchingId":blanchingId, //热烫id
                                                                "coldwaveId":coldwaveId, //剪id
								"straightenId":straightenId, //热烫id
								"barbersId":barbersId, //理发师id
							};
						}
						$.ajax({
							type:"post",
							url:"/saleOrderItem/searchVip",
							data:data,
							success:function(result){
								var result = {status:"200",price:"2000",total:"100"};//测试数据，使用时请删除
								var state = result.status;
								if(state == 200){
									//为主页面添加所选服务
									var html,arrText = [],workers,
										price = result.price,
										rates = result.total;
										if(barbers==null||barbers==""||barbers=="undefined"){
											barbers="-";
										}
										if(haircut==null||haircut==""||haircut=="undefined"){
											haircut="-";
										}
                                                                                if(blanching==null||blanching==""||blanching=="undefined"){
											blanching="-";
										}
                                                                                if(coldwave==null||coldwave==""||coldwave=="undefined"){
											coldwave="-";
										}
                                                                                if(straighten==null||straighten==""||straighten=="undefined"){
											straighten="-";
										}
										if(barbersId==null||barbersId==""||barbersId=="undefined"){
											barbersId="";
										}
										if(haircutId==null||haircutId==""||haircutId=="undefined"){
											haircutId="";
										}
                                                                                if(blanchingId==null||blanchingId==""||blanchingId=="undefined"){
											blanchingId="";
										}
                                                                                if(coldwaveId==null||coldwaveId==""||coldwaveId=="undefined"){
											coldwaveId="";
										}
                                                                                if(straightenId==null||straightenId==""||straightenId=="undefined"){
											straightenId="";
										}
										
									html = "<li class='data_serve'><span>"+haircut+" "+blanching+" "+coldwave+" "+straighten+" "+"</span>，理发师：<span>"+barbers+"</span>，本次服务价格<em class='sever_pic'>"+price+"元</em>，会员价格<em class='sever_upic'>"+rates+"元</em><span class='del_spend'>删除<i class='fa fa-close'></i></span></li>";
									$("iframe[name='cont_box']",Wparent).contents().find(".spend_info ul").append(html);
									var list = $("iframe[name='cont_box']",Wparent).contents().find(".spend_info ul li"),
										picArr = [0,0],total,totalu;
									$(list).each(function(){
										var severPic = $(this).find(".sever_pic").text(),
											severUpic = $(this).find(".sever_upic").text();
                              			                                if(severPic==null||severPic=="undefind"||severPic==""){
											severPic = 0;
										}
										if(severUpic==null||severUpic=="undefind"||severUpic==""){
											severUpic = 0;
										}
										total = parseInt(severPic);
										totalu = parseInt(severUpic);
										totalAll = picArr[0]+total;
										totaluAll = picArr[1]+totalu;
										picArr = [totalAll,totaluAll];
									});
									$("iframe[name='cont_box']",Wparent).contents().find(".spend_info .totalpic").text(picArr[0]+"元");
									$("iframe[name='cont_box']",Wparent).contents().find(".spend_info .totalupic").text(picArr[1]+"元");
									$("iframe[name='cont_box']",Wparent).contents().find(".spend_info",Wparent).show();
									var serveData = {"serveId":serveId,"modelsId":modelsId,"staffId":staffId,"workersId":arr};
									window.parent.frames["cont_box"].serveData.push(serveData);
									//关闭选服务页面
									$(".tip_bg",Wparent).remove();
									$(".tip_box",Wparent).remove();
								}else{
									var errorTxt = "<p class='del_info'>保存失败，请重试</p><div class='tip_btnbox'><button class='btn btn_dsure tip_close'>确认</button></div>";
									$("body",Wparent).append(tipBg);
									$("body",Wparent).append(tipBox);
									$(".tipbox_top",Wparent).append(errorTxt);
									Success(state);
								}
							},
							error:function(errormsg){
								var errorTxt = "<p class='del_info'>操作失败，请重试</p><div class='tip_btnbox'><button class='btn btn_dsure tip_close'>确认</button></div>";
								$("body",Wparent).append(tipBg);
								$("body",Wparent).append(tipBox);
								$(".tipbox_top",Wparent).append(errorTxt);
								Success(500);
							}
						});
					};
				
				});
			});
		</script>
</body>
</html>
